import { NavLink } from 'react-router-dom'
import classNames from 'classnames'
import { AllApplication, FolderFailed } from '@icon-park/react'
import styles from './style.module.less'

export function QuickNav () {
  return (
    <main className="border-b border-divider">
      <NavLink
        to={'/manager/category/contents'}
        className={({ isActive }) => {
          return classNames('font-bold mb-1', {
            [styles.active]: isActive,
          })
        }}
        end
      >
        <div className={styles.cateName}>
          <AllApplication theme="outline" size="14" />
          <span className='truncate'>所有片段</span>
        </div>
      </NavLink>
      <NavLink
        to={'/manager/category/contents/0'}
        className={({ isActive }) => {
          return classNames('font-bold mb-1', {
            [styles.active]: isActive,
          })
        }}
        end
      >
        <div className={styles.cateName}>
          <FolderFailed theme="outline" size="14" />
          <span className='truncate'>未分类</span>
        </div>
      </NavLink>
    </main>
  )
}
